<template>
  <div class="loginorsign">
    <div ref="imageWrapper" style="position:relative;width:500px;height:500px;border:1px solid red;box-sizing:border-box;margin:0 auto;">
      <img src="../assets/logo.png" style="position:absolute;left:-50px;" alt="">
    </div>
    <div class="button">
      <button style="width: 70%;" type="success" size="small" @click="toImage">生成截图</button>
    </div>
    <img :src="imgUrl" alt="">
  </div>
</template>

<style lang="stylus"  scoped>
</style>
<script>
import html2canvas from "html2canvas"
export default {
  name: "loginorsign",
  components: {
  },
  data() {
    return {
      login:'login',
      iphone: "",
      password: "",
    };
  },
  created(){
  },
  methods: {
    toImage() {
      console.log(112)
        html2canvas(this.$refs.imageWrapper).then(canvas => {
          let dataURL = canvas.toDataURL("image/png");
          this.imgUrl = dataURL;
          console.log('dataURL',dataURL)
          if (this.imgUrl !== "") {
            this.dialogTableVisible = true;
          }
        });
      },
    submit() {
      let that = this;
    },
  },
};
</script>
